<template>
	<view class="xm20-25">
		
		<view class="xflex-x-center xmb50 xpt24">
			<image class="jz xmr20" src="/static/image/mine/jz.png" mode=""></image>
			<view class="jzw">
				订单来了
			</view>
		</view>
		<view class="order xp24-32 xbs ">
			
			<view class="">
				<view class="title xbb8D xpb32">
					日历房 订单来啦！
				</view>
				
				<view class="infs">
					<view class="infs-box xflex-x-between xpt24 xpb24">
						<view class=" xflex-x">
							<image class="infs-icon" src="/pagesA/static/images/chuang.png" mode=""></image>
							<view class="xflex-x">
								<view class="infs-span">
									大床房
								</view>
								<view class="infs-span">
									大床房
								</view>
							</view>
						</view>
						<view class="infs-fj">
							库存共 2 间
						</view>
					</view>
					
					
					<view class="infs-box xflex-x-between xpt24 xpb24">
						<view class="  xflex-x">
							<image class="infs-icon" src="/pagesA/static/images/rili.png" mode=""></image>
							<view class="xflex-x">
								<view class="infs-span">
									11月24日 - 11月25日
								</view>
								<view class="infs-span">
									大床房
								</view>
							</view>
						</view>
						
					</view>
					
					
					<view class="infs-box xflex-x-between xpt24 xpb24">
						<view class=" xflex-x">
							<image class="infs-icon" src="/pagesA/static/images/rili.png" mode=""></image>
							<view class="xflex-x">
								<view class="infs-span">
									客人出价
								</view>
								<view class="infs-span1">
									大床房
								</view>
								<view class="infs-span1">
									￥288/间
								</view>
							</view>
						</view>
						
					</view>
				</view>
				
				
				
				
				
				
			</view>
			
			
		</view>
		
		<view class="xp24  xmt32 xbgf">
			<view class="xflex-x xmb40">
				<view class="lab">
					订单编号：
				</view>
				<view class="xflex-x">
					<view class="value">
						2324124232424
					</view>
					<view class="copy xml10">
						复制
					</view>
				</view>
			</view>
			
			<view class="xflex-x">
				<view class="lab">
					下单时间：
				</view>
				<view class="xflex-x">
					<view class="value">
						2024-08-12 20:18:25
					</view>
					
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style>
	page{
		background-color: #f5f5f5;
	}
</style>

<style lang="scss" scoped>
	
	
	.title {
		font-family: PingFang SC;
		font-weight: bold;
		font-size: 30rpx;
		color: #333333;
	}
	
	.infs {
		&-icon {
			width: 44rpx;
			height: 44rpx;
		}
		&-span {
			padding: 6rpx 12rpx;
			font-family: PingFang SC;
			font-weight: 500;
			font-size: 28rpx;
			color: #333333;
			
			background: #F5F5F5;
			border-radius: 3rpx;
			margin-left: 18rpx;
		}
		
		&-span1 {
			padding: 6rpx 12rpx;
			font-family: PingFang SC;
			font-family: PingFang SC;
			font-weight: 500;
			font-size: 26rpx;
			color: #198FFF;
			
			background: #F5F5F5;
			border-radius: 3rpx;
			margin-left: 18rpx;
		}
		&-fj {
			font-family: PingFang SC;
			font-weight: 500;
			font-size: 28rpx;
			color: #198FFF;
		}
		
		&-box {
			border-bottom: 1rpx solid #EEEEEE;
		}
	}
	.order {
		background-color: #fff;
		border-radius: 20rpx;
	}
	
	.xz {
		width: 40rpx;
		height: 40rpx;
		margin-right: 10rpx;
	}
	.top{
		padding-bottom: 27rpx;
		border-bottom: 1rpx solid #EEEEEE;
	}
	.sn {
		font-weight: bold;
		font-size: 30rpx;
		color: #111111;
	}
	.state {
		font-weight: 500;
		font-size: 24rpx;
		color: #198FFF;
	}
	.addicon {
		width: 28rpx;
		height: 28rpx;
		margin-right: 8rpx;
	}
	.jt {
		width: 24rpx;
		height: 24rpx;
		margin-left: 5rpx;
	}
	
	.addname {
		font-weight: bold;
		font-size: 28rpx;
		color: #222222;
	}
	
	.addxg {
		font-weight: 500;
		font-size: 24rpx;
		color: #999999;
	}
	
	.time {
		font-weight: 800;
		font-size: 36rpx;
		color: #222222;
		
	}
	
	.info {
		font-weight: bold;
		font-size: 28rpx;
		color: #222222;
		margin-top: 17rpx;
	}
	
	.star {

		// background: #F8F8F8;
		border-radius: 20rpx;
		padding: 20rpx;
		box-sizing: border-box;
		font-weight: 400;
		font-size: 24rpx;
		color: #666666;
	}
	.cancel {
		width: 174rpx;
		height: 88rpx;
		border-radius: 44rpx;
		border: 1px solid #CCCCCC;
		font-weight: 500;
		font-size: 28rpx;
		color: #666666;
		text-align: center;
		line-height: 88rpx;
	}
	
	.publish {
		width: 440rpx;
		height: 88rpx;
		background: linear-gradient(90deg, #0DBFFB, #198EFF);
		border-radius: 44rpx;
		font-weight: 500;
		font-size: 32rpx;
		color: #FFFFFF;
		text-align: center;
		line-height: 88rpx;
	}
	
	.lab {
		font-weight: bold;
		font-size: 24rpx;
		color: #7C7C7C;
		width: 160rpx;
	}
	
	.value {
		font-weight: bold;
		font-size: 24rpx;
		color: #272727;
	}
	.copy {
		font-weight: bold;
		font-size: 22rpx;
		color: #333333;
		width: 70rpx;
		height: 36rpx;
		background: #F2F2F2;
		border-radius: 18rpx;
		text-align: center;
		line-height: 36rpx;
	}
	.jz {
		width: 36rpx;
		height: 36rpx;
	}
	
	.jzw {
		font-weight: bold;
		font-size: 40rpx;
		color: #40D204;
	}

</style>
